<template>
  <div>
    <el-form
      :model="form"
      label-position="left"
      label-width="100px"
      :rules="rules"
      ref="unitRef"
    >
      <div class="formBox line">
        <el-form-item label="项目名称：" prop="p_name">
          <el-input
            v-model.trim="form.p_name"
            autocomplete="on"
            placeholder="请输入项目名称"
          ></el-input>
        </el-form-item>
      </div>
    </el-form>
    <div class="footBtns">
      <el-button @click="fail">取 消</el-button>
      <el-button type="primary" style="margin-left: 50px" @click="submitProject"
        >确 定</el-button
      >
    </div>
  </div>
</template>
  <script>
export default {
  name: "project-add",
  props: {
    detailData: Object,
  },
  data() {
    return {
      form: this.detailData
        ? this.detailData
        : {
            p_name: "",
          },
      rules: {
        p_name: [{ required: true, message: "请输入项目名称", trigger: "blur" }],
      },
    };
  },
  methods: {
    //取消弹框
    fail() {
      this.$emit("fail");
    },
    //提交单位
    submitProject() {
      this.$refs.unitRef.validate((v) => {
        if (v) {
          this.$message({
            message: this.form.id ? "编辑成功" : "创建成功",
            type: "success",
          });
          this.$emit("success");
        } else {
        }
      });
    },
  },
};
</script>

<style scoped>
.footBtns {
  text-align: center;
}
</style>